<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>管理员登录</title>
		<!--导入框架样式文件-->
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/base.css" />
		<script type="text/javascript" src="js/jquery1.12.4.min.js"></script>
		<script type="text/javascript" src="js/bootstrap.min.js"></script>
		
		
	</head>

	<body>
		<div class="container">
			<h2>管理员登录</h2>
			<form method="get" action="">
				<div class="form-group">
					<label class="control-label">用户名</label>
					<input type="text" class="form-control" placeholder="请输入用户名" name="username"  required/>
				</div>
				<div class="form-group">
					<label class="control-label">密码</label>
					<input type="password" class="form-control" placeholder="请输入密码" name="password" required />
				</div>
				<button type="submit" class="btn btn-success btn-block">登录</button>
				<button type="submit" class="btn btn-danger btn-block">取消</button>
			</form>
			<div class="alert alert-warning alert-dismissible" role="alert">
				<button type="button" class="close" data-dismiss="alert" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				登录失败!!!
		</div>
		</div>
		
		<button class="btn btn-primary " id="addModel">添加</button>
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">模态框（Modal）标题</h4>
            </div>
            <div class="modal-body">在这里添加一些文本</div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="add-btn">提交更改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
		<script>
			
			$(function(){
				
				$("#addModel").click(function(){
					
						$("#myModal").modal("show");
				})
				$("#add-btn").click(function(){
					
					
					   alert("添加成功");
					   $("#myModal").modal("hide");
					
				});
			
			})
		</script>
	</body>
</html>